<include file="public@header">
<body style="background: #1f1e24;">
   <h3 class="mytitle" style="margin-top: 0.8rem"></h3>
    <div class="bgbg" style="width: 6.7rem;margin: 0 0.4rem;background: #1f2630;">
        <form action="" method="post" class="layui-form">
            <div class="dlxlogin-input">
                <div class="payinf">
                    <p>{:lang('Real name')}</p>
                    <input type="text" name="name" placeholder="{:lang('Please enter your real name')}" value="{$auth.name|default=''}" class="inputplace">
                </div>
                <div class="payinf">
                    <p>{:lang('ID number')}</p>
                    <input type="text" name="id_card" placeholder="{:lang('Please input your ID number')}" value="{$auth.id_card|default=''}" class="inputplace">
                </div>
            </div>
            <div class="idcardimg">
                <div class="idcardimg1">
                    <div class="idcardimg-content">
                        <img src="<if $auth.front_photo>{:cmf_get_image_preview_url($auth.front_photo)}<else/>__STATIC__/hybit/images/photo.png</if>" id="front_photo" alt="">
                        <input type="hidden" name="front_photo" value="{$auth.front_photo|default=''}">
                    </div>
                    <p>{:lang('Front photo of ID card')}</p>
                </div>
                <div class="idcardimg1">
                    <div class="idcardimg-content">
                        <img src="<if $auth.back_photo>{:cmf_get_image_preview_url($auth.back_photo)}<else/>__STATIC__/hybit/images/photo.png</if>" id="back_photo" alt="">
                        <input type="hidden" name="back_photo" value="{$auth.back_photo|default=''}">
                    </div>
                    <p>{:lang('Photo on the back of ID card')}</p>
                </div>
            </div>
            <input type="submit" value="{:lang('Submit')}" class="paybtn" lay-submit>
        </form>
    </div>
    
    <script src="__STATIC__/hybit/js/jquery.min.js"></script>
    <script src="__STATIC__/layui/layui.js"></script>
    <script>
        layui.use(['form','layer','upload'],function(){
            var layer = layui.layer,
                form = layui.form,
                upload = layui.upload;

            upload.render({
                elem: '#front_photo',
                accept: 'images',
                acceptMime: 'image/*',
                url: '{:url("user/asset/webuploader")}',
                before: function(obj){
                    layer.load();
                    obj.preview(function(index, file, result){
                        $('#front_photo').attr('src', result); //图片链接（base64）
                    });
                },
                done: function(res){
                    //上传完毕回调
                    layer.closeAll('loading');
                    $('input[name=front_photo]').val(res.data.filepath);
                }
            });

            upload.render({
                elem: '#back_photo',
                accept: 'images',
                acceptMime: 'image/*',
                url: '{:url("user/asset/webuploader")}',
                before: function(obj){
                    layer.load();
                    obj.preview(function(index, file, result){
                        $('#back_photo').attr('src', result); //图片链接（base64）
                    });
                },
                done: function(res){
                    //上传完毕回调
                    layer.closeAll('loading');
                    $('input[name=back_photo]').val(res.data.filepath);
                }
            });

            //监听提交
            form.on('submit', function(data){
                var _this = $(this);
                _this.attr("disabled",true);
                $.ajax({
                    type: 'post',
                    url: '{:url("user/profile/auth")}',
                    data: data.field,
                    success:function(res){
                        layer.msg(res.msg)
                        if(res.code == 1){
                            setTimeout(function(){ location.reload(); }, 1500);
                        }else{
                            _this.removeAttr("disabled");
                        }
                    }
                });
                return false;
            });
        });
    </script>
</body>
</html>